﻿<!DOCTYPE html>
<html>
<head>
    <meta charset="utf-8" />
    <title>@ViewBag.Title</title>
    <link href="@Url.Content("~/Content/Main.css")" rel="stylesheet" type="text/css" />
    <link href=@Url.Content("http://fonts.googleapis.com/css?family=Open+Sans+Condensed:300,300italic,700") rel='stylesheet' type='text/css' />

    <link href="~/Content/jquery-ui.min.css" rel="stylesheet" type="text/css" />
    <link href="~/Content/bootstrap.css" rel="stylesheet" type="text/css" />

    <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
    <script src="http://ajax.googleapis.com/ajax/libs/angularjs/1.2.15/angular.min.js"></script>
    <script src="http://cdn.datatables.net/1.10.2/js/jquery.dataTables.min.js"></script>
    
    <script src="~/Content/js/angularApp.js"></script>
    <script src="~/Content/js/jquery-ui.min.js"></script>
    <script src="~/Content/js/jquery.base64.js"></script>
    <script src="~/Content/js/main.js"></script>
    <script src="~/Content/js/Papa.js"></script>
    <script src="~/Content/js/bootstrap.js"></script>

    <script src="~/Content/js/Autocomplete.js" type="text/javascript"></script>

</head>
<body>
    <div id="layoutWrapper">
        <div id="layoutHeader">
            @if (User != null && User.Identity.IsAuthenticated)
            {
                <h2>@Html.ActionLink("log out", "Logout", "Authentification")</h2>
            }
            
            <div id="section1">
                <h1>@Html.ActionLink("DoeLibS", "MyBorrowings", "User")</h1>

                <div id="searchBar">
                    @using (Html.BeginForm("Simple", "Search", FormMethod.Post))
                    {
                        @Html.TextBox("searchTerm", null, new { @class = "searchFormTxtBox", @placeholder = "search..." })
                        @Html.DropDownList("searchOption", (SelectList)ViewBag.list, new { @class = "searchFormSelect" })
                        <input type="submit" value="search" class="generalBtn" />
                    }
                </div>
            </div>

            @Html.Partial("_userMenue")
        </div>

        <div id="layoutContent">    
            
            @if (Message != null)
            {
                if (Message.Success)
                {
                    <div class="modal fade" id="successModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-messageContent">
                                <div class="modal-successHeader">
                                    <h4 class="modal-title" id="myModalLabel">Success</h4>
                                </div>
                                <div class="modal-messageBody">  
                                    @Message.Message                                      
                                </div>
                            </div>
                        </div>
                    </div>

                    <script>
                        $('#successModal').modal('show');
                        setTimeout(function () { $('#successModal').modal('hide'); }, 2500);
                    </script>

                }
                else
                {
                    <div class="modal fade" id="errorModal" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                        <div class="modal-dialog">
                            <div class="modal-messageContent">
                                <div class="modal-errorHeader">
                                    <h4 class="modal-title" id="myModalLabel">Error</h4>
                                </div>
                                <div class="modal-messageBody">
                                    @Message.Message
                                </div>
                                <div class="modal-footer">
                                </div>
                            </div>
                        </div>
                    </div>

                    <script>
                        $('#errorModal').modal('show');
                        setTimeout(function () { $('#errorModal').modal('hide'); }, 3500);
                    </script>
                }

                //clear the message (--> expire the messagecookie)
                Message = null;
            }
            else
            {
                <div class="modal fade" id="successModalDynamic" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-messageContent">
                            <div class="modal-successHeader">
                                <h4 class="modal-title" id="myModalLabel">Success</h4>
                            </div>
                            <div class="modal-messageBody">
                                
                            </div>
                        </div>
                    </div>
                </div>
                
                <div class="modal fade" id="errorModalDynamic" tabindex="-1" role="dialog" aria-labelledby="myModalLabel" aria-hidden="true">
                    <div class="modal-dialog">
                        <div class="modal-messageContent">
                            <div class="modal-errorHeader">
                                <h4 class="modal-title" id="myModalLabel">Error</h4>
                            </div>
                            <div class="modal-messageBody">
                                
                            </div>
                            <div class="modal-footer">
                            </div>
                        </div>
                    </div>
                </div>
            }
                    
            @RenderBody()
        </div>
                
    </div>
    @*<div id="layoutFooter">
        <div id="footerTopBar"></div>
    </div>*@

    @if (User != null)
    {
        <script type="text/javascript">
            window.setInterval(loadNotificationCount, 30000);

            function loadNotificationCount() {
                console.log("load notifications");

                $.ajax({
                    url: "/api/notification/",
                    type: "GET",
                    beforeSend: function (xhr) {
                        xhr.setRequestHeader("Authorization", getAuthorizationHeader('@User.UserId', ''));
                    },
                    dataType: "json"
                }).done(function (data) {
            
                    var total = data.length;

                    $.ajax({
                        url: "/api/notification?read=false",
                        type: "GET",
                        beforeSend: function (xhr) {
                            xhr.setRequestHeader("Authorization", getAuthorizationHeader('@User.UserId', ''));
                        },
                        dataType: "json"
                    }).done(function (data) {
            
                        var unread = data.length;

                        if (unread > 0) {
                            $("#notificationLink").text("notifications (" + unread + "/" + total + ")");
                            document.title = "(" + unread + ") " + "@ViewBag.Title";
                            $("#notificationLink").addClass("notificationAlert");
                        } else {
                            $("#notificationLink").text("notifications (0/" + total + ")");
                        }

                    }).fail(function () {
                        console.log("could not load notifications");
                    });

                }).fail(function () {
                    console.log("could not load notifications");
                });
            }

        @*$.getJSON("/api/notification/@User.UserId", function (data) {
            var total = data.length;

            if (total > 0) {
                $.getJSON("/api/notification/unread/@User.UserId", function (data) {
                            var unread = data.length;

                            if (unread > 0) {
                                $("#notificationLink").text("notifications (" + unread + "/" + total + ")");
                                document.title = "(" + unread + ") " + "@ViewBag.Title";
                                $("#notificationLink").addClass("notificationAlert");
                            } else {
                                $("#notificationLink").text("notifications (0/" + total + ")");
                            }
                        });
                    }

                });
            }*@

            $(document).ready(function () {
                loadNotificationCount();
            });
</script>
    }

</body>
</html>


